import React, {Component} from 'react';
import {View} from 'react-native';
import {Container, Content, Card, CardItem, Text, Button, Left, Body, Right} from 'native-base';
import Icon from '../../../../components/Icon';
import {connect} from 'react-redux';
import Nav from './Nav';
import TabIcon from './TabIcon';

@connect(state => ({state: {...state.home}}))
class Work extends Component {
	
	render() {
		let {state, dispatch} = this.props;
		return (
			<Container>
				<Nav title='任务' hiddenBack={true} />
				<Content>
					<Card style={{
						marginTop: 10,
						marginLeft: 10, 
						marginRight: 10,
					}}>
						<CardItem>
			              	<Left>
				                <Icon type='workCheck' width={30} height={30} />
				                <Body>
				                  <Text>寒假作业 02月23日</Text>
				                  <Text note>初一七班</Text>
				                </Body>
			              	</Left>
			            </CardItem>
			            <CardItem style={{flexDirection: 'column'}}>
			            	<View><Text note>5人已上交</Text></View>
			            	<View><Text note>10人未上交</Text></View>
			            </CardItem>
			            <CardItem style={{paddingBottom: 0}}>
			              	<Left><Text note>11小时前</Text></Left>
			              	<Right><Button transparent><Text>去批改</Text></Button></Right>
			            </CardItem>
					</Card>
					
					<Card style={{
						marginTop: 10,
						marginLeft: 10, 
						marginRight: 10,
					}}>
						<CardItem>
			              	<Left>
				                <Icon type='workDo' width={30} height={30} />
				                <Body>
				                  <Text>寒假作业 02月23日</Text>
				                  <Text note>初一七班</Text>
				                </Body>
			              	</Left>
			            </CardItem>
			            <CardItem style={{flexDirection: 'column'}}>
			            	<View><Text note>10人已上交</Text></View>
			            	<View><Text note>15小时后截止</Text></View>
			            </CardItem>
			            <CardItem style={{paddingBottom: 0}}>
			              	<Left><Text note>11小时前</Text></Left>
			              	<Right><Button transparent><Text>去完成</Text></Button></Right>
			            </CardItem>
					</Card>
		    	</Content>
	    	</Container>
		)
	}
	
	shouldComponentUpdate({state}) {
		if(this.props.state.tab != state.tab) {
			return false;
		}
		return true;
	}
	
}

export default Work;
